<template>
	<view class="page">
		<view class="info_box">

			<view class="info_box_base">
				<view class="info_box_base_title" style="font-weight: bold;">站点信息</view>
				<view class="info_box_base_item">所属地区：{{baseInfo.region}}</view>
				<view class="info_box_base_item">站点编号：{{baseInfo.site_number}}</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 1">运营商：中国移动</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 2">运营商：中国电信</view>
				<view class="info_box_base_item" v-if="baseInfo.operators == 3">运营商：中国联通</view>
				<view class="info_box_base_item">站点名称：{{baseInfo.title}}</view>
				<view class="info_box_base_item">站点地址：{{baseInfo.site_address}}</view>
				<view class="info_box_base_item">联系人及电话：{{baseInfo.contacts}} {{baseInfo.phonetel}}</view>
				<view class="info_box_base_item">经纬度： 经度 {{params_old.longitude}} 纬度{{params_old.latitude}} </view>
				<view class="info_box_base_item">网络类型：{{wllxText}}</view>
				<view class="info_box_base_item" style="color: red;" v-if="baseInfo.status == 3">拒绝原因：<text class="base_item_dd">{{baseInfo.rejection}}</text></view>
				<view class="info_box_base_item">设备型号：{{params_old.equipment_model}}</view>
				<view class="info_box_base_item_1">
					<view class="info_box_base_item_img_title">设备数量：</view>
					<view class="info_box_base_item_1_item" style="display: flex;flex-direction: row;flex-wrap: wrap;">
						<view class="info_box_base_item_1_item_i">
							<text>接收设备：{{params_old.equi_mater_receivingdevice}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>覆盖设备：{{params_old.equi_mater_coveragedevice}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>扩展设备4口：{{params_old.port_4expansion}}</text>

						</view>
						<view class="info_box_base_item_1_item_i">
							<text>扩展设备8口：{{params_old.port_8expansion}}</text>

						</view>
					</view>
				</view>
				<view class="info_box_base_item">竣工图纸：<text class="down_link" @click="down">点此链接下载</text></view>
			</view>


			<view class="info_box_base">
				<view class="info_box_base_title" style="font-weight: bold;">故障问题描述</view>

				<view class="gcxt_b_wy">
					<u-checkbox-group @change="chooseTj"  v-model="params.faultproblemdesc_id"
						style="width: 690rpx;flex-wrap: wrap;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;">
						<u-checkbox disabled v-for="(item,index ) in gzwtdata" :key="index" :name="item.id" size="13"
							style="width: 33%;margin-bottom: 20rpx;" labelSize="13" :label="item.title"></u-checkbox>
					</u-checkbox-group>
				</view>

				<view class="gcxt_b_wy_reason">
					<view>其他说明：</view>
					<view
						style="width: 100%;line-height: 45rpx;font-size:25rpx;word-wrap: break-word;overflow-wrap: break-word;white-space: normal;">
						{{params_old.other_instructions}}</view>

				</view>
			</view>
			<view class="gcxt_b_wy_reason" style="font-size: 25rpx;margin: 10px 0;">
				<view style="margin: 10rpx 0;">工单说明：</view>
				<view
					style="width: 100%;line-height: 45rpx;font-size:25rpx;word-wrap: break-word;overflow-wrap: break-word;white-space: normal;">
					{{params_old.work_orderdesc}}</view>

			</view>

			<view class="btn" @click="next">下一步</view>
		</view>
	</view>
</template>

<script>
	import {
		api,
		apiBaseUrl,
		http
	} from '@/config/common.js'
	export default {
		data() {
			return {
				wllx:[],
				wllxText:'',
				id: '',
				fileList1: [],
				fileList2: [],
				gzwtdata: [],
				params: {
					faultproblemdesc_id: []
				},
				params_old:{},
				baseInfo: {}
			}
		},
		components: {},
		filters: {},
		mounted() {},
		onLoad(e) {
			this.id = e.id
			this.getBaseInfo()
			this.getGzwtms()
			
			this.getWlle()
		},
		onShow() {},
		onPageScroll(e) {},
		beforeDestroy() {},
		methods: {
			//网络类型
			getWlle() {
				uni.showLoading({})
				api.post('/api/shop/survey_network_type', {}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						let rstt = rst.data
						rstt.map(function(item) {
							item.name = item.title
						})
						this.wllx = rst.data
					}
					this.lookInfo()
				}).catch(err => {
					uni.hideLoading()
				})
			},
			chooseTj(e) {
				this.params.faultproblemdesc_id = e
			},
			lookInfo() {
				uni.showLoading({})
				api.post('api/shop/submit_mainsiteinforma', {
					main_id: this.id,
					type: 2
				}).then(res => {  
					let rst = res.data  
					uni.hideLoading()
					if (rst.code == 1) {  
						
						if (rst.data) {
							rst.data.faultproblemdesc_id = rst.data.faultproblemdesc_id ? rst.data.faultproblemdesc_id.map(item => parseInt(item,10)) : []
							this.params  =rst.data 
							this.params_old = rst.data 
							
							let wllxText = [];
							this.wllx.forEach(function(item){
								rst.data.network_type_id.forEach(function(itemm){ 
									if (item.id == itemm){ 
										wllxText.push(item.name)  
									}
								}) 
							})   
							this.wllxText = wllxText.join(',')
							
						}
						 
					}

				}).catch(err => {
					uni.hideLoading()
				})
			},
			down() {
				window.open(this.baseInfo.asbuilt_drawings, '_blank'); 
				// uni.previewImage({
				// 	urls:[this.baseInfo.asbuilt_drawings]
				// }) 
			},
			getBaseInfo() {
				uni.showLoading({})
				api.post('/api/shop/kanc_maintenanceengineer', {
					main_id: this.id
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.baseInfo = rst.data
					}

				}).catch(err => {
					uni.hideLoading()
				})
			},
			//故障问题描述
			getGzwtms() {
				uni.showLoading({})
				api.post('/api/shop/engin_voicecall_faultproblemdesc_faultfind', {
					type: 3
				}).then(res => {
					let rst = res.data
					uni.hideLoading()
					if (rst.code == 1) {
						this.gzwtdata = rst.data
					}
				}).catch(err => {
					uni.hideLoading()
				})
			},
			next() {
				let rst = this.params
				if (Array.isArray(rst.faultproblemdesc_id)) {
				  rst.faultproblemdesc_id = rst.faultproblemdesc_id.join(",")
				}
				
				
				uni.showLoading({})
				api.post('api/shop/submit_mainsiteinforma', {
					main_id: this.id,
					...rst,
					type: 1
				}).then(res => {
					let rsttt = res.data
					
					uni.hideLoading()
					if (rsttt.code == 1) {
						uni.navigateTo({
							url: '/pages/gcwx/gzfx?id='+this.id
						})
					} else {
						uni.$u.toast(rsttt.msg)
					}
				}).catch(err => {
					uni.hideLoading()
				})


			},

		}
	};
</script>

<style scoped>
	.base_item_dd{
		word-wrap: break-word;
		overflow-wrap: break-word;
		white-space: normal;
		width: 80%;
	}
	.info_box_base_item_img_title {
		font-size: 25rpx;
		margin: 20rpx 0;
	}

	.info_box_base_item_1_item_i {
		width: 30%;
		display: flex;
		flex-direction: row;
		align-items: center;
		margin-left: 3%;
		margin-bottom: 20rpx;
	}

	.down_link {
		color: rgb(11, 125, 218);
		font-size: 25rpx;
	}

	.btn {
		width: 500rpx;
		height: 80rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		margin-top: 40rpx;
		background-color: rgb(70, 179, 255);
		color: #fff;
		border-radius: 40rpx;
		font-size: 32rpx;
	}

	::v-deep .uni-input-input {
		font-size: 26rpx;
	}

	::v-deep .uni-input-placeholder {
		font-size: 26rpx;
	}

	.gcxt_b_wy_reason {
		display: flex;
		flex-direction: row;
		align-items: center;
		flex-wrap: wrap;
		word-wrap: break-word;
		/* 允许在单词内换行 */
		overflow-wrap: break-word;
		/* 同上，现代浏览器推荐使用这个属性别名 */
		white-space: normal;
		/* 允许自动换行 */
	}

	.gcxt_b_wy {
		display: flex;
		flex-direction: row;
		align-items: center;
		margin: 20rpx 0;
		flex-wrap: wrap;
	}

	.info_box_base {
		border: 1px solid rgb(235, 229, 229);
		padding: 20rpx;
		font-size: 26rpx;
		margin-top: 20rpx;
	}

	.info_box_base_item {
		line-height: 50rpx;
		word-wrap: break-word;
		/* 允许在单词内换行 */
		overflow-wrap: break-word;
		/* 同上，现代浏览器推荐使用这个属性别名 */
		white-space: normal;
		/* 允许自动换行 */
	}

	.info_box {
		width: 710rpx;
		margin: 0 auto;
		padding-bottom: 40rpx;
	}

	page {
		background-color: #fff;
	}
</style>